<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <script src="./jquery.js"></script>
  </head>
  <body>
    <textarea name="" id="con" cols="30" rows="10"> </textarea>
    <input type="text" id="userinput" />
  </body>
  <script>
    var arr
    $(function () {
      //获取本地存储数据 并判断是否有值 如果没有值就创建一个空数组
      arr = JSON.parse(localStorage.getItem('arr')) ?? []
      $('#userinput').on('keyup', function () {
        // console.log(event.keyCode)
        if (event.keyCode === 13) {
          //添加到临时数组
          arr.push($(this).val())
          //添加到本地存储
          localStorage.setItem('arr', JSON.stringify(arr))
          //设置文本框为空
          $(this).val('')
          //显示文本域内容
          showText()
        }
      })
      showText()
    })
    function showText() {
      var str = ''
      for (var i in arr) {
        str += `${+i + 1}.${arr[i]}\n`
      }
      $('#con').val(str)
    }
  </script>
</html>
